<template>
  <el-container style="height: 100%; border: 1px solid #eee">
    <el-aside width="100%" style="background-color: rgb(238, 241, 246)">
      <el-menu>
        <el-menu-item index="1" @click="navigateTo('/home')">
          <i class="el-icon-s-home"></i>首页
        </el-menu-item>
        <el-menu-item index="2" @click="navigateTo('/users')">
          <i class="el-icon-user"></i>用户管理
        </el-menu-item>
        <el-menu-item index="3" @click="navigateTo('/products')">
          <i class="el-icon-goods"></i>商品管理
        </el-menu-item>
        <el-menu-item index="4" @click="navigateTo('/orders')">
          <i class="el-icon-document"></i>订单管理
        </el-menu-item>
        <el-menu-item index="5" @click="navigateTo('/analytics')">
          <i class="el-icon-data-analysis"></i>数据分析
        </el-menu-item>
        <el-menu-item index="6" @click="navigateTo('/settings')">
          <i class="el-icon-setting"></i>系统设置
        </el-menu-item>
        <el-menu-item index="7" @click="navigateTo('/help')">
          <i class="el-icon-question"></i>帮助与支持
        </el-menu-item>
      </el-menu>
    </el-aside>
  </el-container>
</template>

<script>
export default {
  methods: {
    navigateTo(path) {
      this.$router.push(path);
    }
  }
};
</script>

<style scoped>
.el-aside {
  border-right: 1px solid #eee;
}
</style>
